﻿<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0 minimal-ui"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <title>详情</title>
    <link type="text/css" href="css/basic.css" rel="stylesheet">
    <link type="text/css" href="css/swiper.min.css" rel="stylesheet">
    <link type="text/css" href="css/index.css" rel="stylesheet">

    <script type="text/javascript" src="js/jquery-1.10.1.min.js"></script>

</head>
<body>
<header class="news-hd news-imgList-hd news-ground">
    <div class="news-imgList-hd-wrap clearfix">
        <div class="mod-back-btn fn-fl"><i class="i-topPoint"></i></div>
        <div class="mod-header-txt fn-fl">
            黔送铁军圆满完成天生桥换流站抢修任务
            <div class="news-ground-tip">
                <i class="i-select mr5"></i>图集浏览完毕
            </div>
        </div>
        <div class="mod-back-btn fn-fr"><i class="i-ellips">●●●</i></div>
    </div>
</header>
<!--内容模块-->
<section class="news-imgList-content mod-bg-back">
    <div class="news-imgList-content-hd">
        <i class="i-ground"></i>推荐图集
    </div>
    <!-- Swiper -->
    <div class="swiper-container">
        <div class="swiper-wrapper">
            <div class="swiper-slide">
                <ul class="news-imgList-ul">
                    <li>
                        <a href="javascript:void(0);" class="news-imgList-item fn-pr">
                            <img src="images/pic04.jpg" alt="" />
                            <div class="news-imgList-item-hd">
                                <h3 class="news-imgList-item-txt">桂林城郊公司：情暖三月天幸福女人节</h3>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:void(0);" class="news-imgList-item fn-pr">
                            <img src="images/pic04.jpg" alt="" />
                            <div class="news-imgList-item-hd">
                                <h3 class="news-imgList-item-txt">桂林城郊公司：情暖三月天幸福女人节</h3>
                            </div>
                        </a>
                    </li>
                </ul>
            </div>
            <div class="swiper-slide">Slide 2</div>
            <div class="swiper-slide">Slide 3</div>
            <div class="swiper-slide">Slide 4</div>
            <div class="swiper-slide">Slide 5</div>
            <div class="swiper-slide">Slide 6</div>
            <div class="swiper-slide">Slide 7</div>
            <div class="swiper-slide">Slide 8</div>
            <div class="swiper-slide">Slide 9</div>
            <div class="swiper-slide">Slide 10</div>
        </div>
        <!-- Add Pagination -->
        <div class="swiper-pagination fn-dn"></div>
        <!-- Add Arrows -->
        <div class="swiper-button-next">下一图集</div>
        <div class="swiper-button-prev">上一图片</div>
    </div>
</section>

<script type="text/javascript" src="js/swiper.min.js"></script>
<script>
    var swiper = new Swiper('.swiper-container', {
        pagination: '.swiper-pagination',
        paginationClickable: true,
        nextButton: '.swiper-button-next',
        prevButton: '.swiper-button-prev',
        spaceBetween: 30
    });
</script>
</body>
</html>